import * as React from 'react';
import { connect } from 'dva';
import { createSelector } from 'reselect'
import { pure, Logger } from '../../utils';
import { UserState } from '../../models';
import List from './List';
import Filter from './Filter';
// 接口类型定义
import { Dispatch } from 'redux';

// logger
const logger = Logger.get('routes_user');

interface PageProps {
  user: UserState,
  dispatch: Dispatch<any>,
  loading: any,
}

const Page: React.StatelessComponent<PageProps> = ({ dispatch, user, loading }) => {
  logger.info('User');
  const { list, total } = user;
  const listProps = {
    list,
    total
  }

  const filterProps = {

  }

  return (
    <div className="content-inner">
      <Filter {...filterProps}/>
      <List {...listProps}/>
    </div>
  );
}

const selector = createSelector(
  (state: any) => state.user,
  (state: any) => state.loading.models.user,
  (user, loading) => {
    logger.debug(loading);
    return { user, loading };
  }
);

export default connect(selector)(pure(Page));
